<?php
$featureName = '视频';
$permission = 'wap';
?>
@extends('admin.tableLayout')
@section('title',$featureName.'列表')
@section('barName',$featureName.'列表')
@section('quote')
<form class="layui-form" >
    <label>状态：</label>
    <div class="layui-inline">
        <select name="status"  id="status" lay-search lay-filter="select">
            <option value="">全部</option>
            @foreach($status as $k=>$v)
            <option value="{{$k}}">{{$v}}</option>
            @endforeach
        </select>

    </div>
    <div id="select" class="layui-inline"></div>

    <div class="layui-inline">
        <input type="text" class="layui-input" width="200px" id="datetime" name="searchTime" value="" placeholder="日期范围搜索">
    </div>
    <div class="layui-inline">
        <input type="text" name="searchKey" placeholder="{{$featureName}}名称" autocomplete="off" value="" class="layui-input">
    </div>
    <button lay-filter="search" class="layui-btn" id="search"><i class="fa fa-search" aria-hidden="true"></i> 查询</button>
</form>
@endsection

@section('checkbox_btn')

@endsection
@section('toolbar')
@can($permission)
<a class="layui-btn layui-btn-mini" lay-event="chose">选择</a>
@endcan
@endsection
@section('tableRender')
<script>
    layui.use(['table','jquery','form'], function(){
        var table = layui.table;
        var $=layui.jquery;
        var form=layui.form;
        var category_id=$("#category_id").val();
        var _renderLoad = layer.msg('正在查找{{$featureName}}，请稍候',{icon: 16,time:false,shade:0.8});
        var render=table.render({
            elem:"#table",
            page:true,
            id:'idTest',
            url:'{{route('admin.postsAjax')}}',
            where:{
                searchKey:$("input[name='searchKey']").val(),
                searchTime:$("input[name='searchTime']").val(),
                status:$("#status").val(),
                category_id:18
            },
            height:400,
            cols:  [[ //标题栏
                {checkbox:true,fixed:true},
                {field: 'id', title: 'ID', width: 80,fixed:true}
                ,{field: 'post_title', title: '{{$featureName}}名称', width: 200},
                {field: 'status', title: '状态', width: 80},
                {field: 'created_at', title: '创建时间', width: 150},
                {field: 'updated_at', title: '修改时间', width: 150},
                {fixed: 'right', width:150,title:'操作', align:'center', toolbar: '#toolbar'}
                //这里的toolbar值是模板元素的选择器
            ]],
            response: {//返回格式自定义
                statusName: 'code' //数据状态的字段名称，默认：code
                ,statusCode: 0 //成功的状态码，默认：0
                ,msgName: 'msg' //状态信息的字段名称，默认：msg
                ,countName: 'total' //数据总数的字段名称，默认：count
                ,dataName: 'data' //数据列表的字段名称，默认：data
            },
            done:function () {
                layer.close(_renderLoad);
            }
        });
        $('#search').on('click',function () {
            var data = {
                searchKey:$("input[name='searchKey']").val(),
                searchTime:$("input[name='searchTime']").val(),
                status:$("#status").val(),
                category_id:18
            };
            _renderLoad = layer.msg('正在查找{{$featureName}}，请稍候',{icon: 16,time:false,shade:0.8});
            render.reload(
                {
                    where:data
                }
            );
            return false;
        })
        table.on('checkbox(table)', function(obj){
            //console.log(obj)
        });

        table.on('tool(table)', function(obj){ //注：tool是工具条事件名，test是table原始容器的属性 lay-filter="对应的值"
            var data = obj.data; //获得当前行数据
            var layEvent = obj.event; //获得 lay-event 对应的值
            var tr = obj.tr; //获得当前行 tr 的DOM对象
            if(layEvent === 'chose'){ //编辑
                parent.video = data;
                console.log(data)
                var index = parent.layer.getFrameIndex(window.name); //先得到当前iframe层的索引
                parent.layer.close(index); //再执行关闭                       //do something
                //同步更新缓存对应的值
            }
        });
    });
</script>
@endsection

